<div class="fl-option-toolbar">
    <div class="messages messages icon"></div>
    <div class="fl-toolbar-left-wrapper">
      <h1>Messages</h1>
    </div>
    <div class="fl-toolbar-right-wrapper">
        <!-- <a class="pinit icon dataTip" data-placement="left" data-original-title="Pin this to Dashboard"></a> -->
    </div>
     <div class="clearfix"></div>
  </div><!-- end of option toolbar -->
<div class="fl-message-wrapper">
 
   <?php
      $auth = Auth::getAuth('current_user');
      $userCompany = new userQueries();
   ?>
   <div class="fl-left-wrapper">
      <div class="fl-head-title-wrapper">
           <p>Inbox <strong class="counter inboxCount" style="position:absolute; top:7px;"><?php echo $userCompany->countMsg($auth['id']); ?></strong></p>
      </div>
      <div class="scrollbarM fl-left-wrapper-content">
         <div class="fl-inbox-item-wrapper">
            <!--<div class="scrollbarM contentHolder">-->
               <center>
                 <!--  <img src="/images/loader/loader.gif" class="display load_m offsetTop5" />-->
                   <div class="spinner display load_m">
                       <div class="bar1"></div>
                       <div class="bar2"></div>
                       <div class="bar3"></div>
                       <div class="bar4"></div>
                       <div class="bar5"></div>
                       <div class="bar6"></div>
                      <div class="bar7"></div>
                      <div class="bar8"></div>
                      <div class="bar9"></div>
                      <div class="bar10"></div>
                 </div>
               </center> 
               <ul class="loadMsgList"></ul>
           <!-- </div>-->
         </div>
      </div>    
   </div>
    <div class="fl-right-wrapper">
       <div class="fl-head-title-wrapper">
            <label class="conversationTo" style="font-size: 12px;"></label>
        <div class="fl-head-menu-wrapper">
         <ul class="fl-head-menu">
            <li id="fl-create-btn" class="_create_msg"><i class="fa fa-envelope-o "></i> Create Message</li>   
            <li id="fl-action-btn" class="msg_actions"><i class="fa fa-cog"></i>  Actions</li> 
         </ul>
         <ul id="fl-action-option" style="z-index:1;">
            <li class="deleteMessage deleteConversation" data-id=""><i class="fa fa-trash-o"></i> Delete Conversation</li>
             <li class="addPeopleConversation" data-id=""><i class="fa fa-plus"></i> Add People</li>
          </ul>
       </div>
      <div class="clearfix"></div>
        </div>
        <div id="fl-no-conversation-wrapper " class="msg_container">
        <ul class="scrollbarP messagesOne contentHolder pull-left" style="height: 300px;">
               <div class="msgviewContent">
                  <div class="msgNote ">
                     <label>
                        <label>No Conversation Selected</label>
                        <br>
                        <label>Select message from the left</label>
                        <br>
                        <label>side to view your conversation</label>
                     </label>
                  </div>
               </div>
            </ul>
        <Br/><Br/>
        <div class="fl-reply-message-wrapper">
         <form id="postFile" method="post" enctype="multipart/form-data" action='/ajax/uploadFile'>
           <div id="uniform-fileInput" class="uploader" style="margin-left:5px;">
             <input type="file" data-action-id="2" value="upload"
                name="postFile" id="uploadForm" size="24" data-get-file="imagePost" data-show="imagePreviewUpload" data-form="postFile" data-location="previewImagePostUpload" data-action-type="postFile" style="opacity: 0;" class="postFile">
             <span id="uploadFilename_2" class="filename">No file selected</span>
             <span class="action">Choose File</span>
             <input type="hidden" value="messageFileUpload" name="uploadType">
             <input type="hidden" value="messageUpload" name="uploadFolder">
          </div>
          
                     <div class="postActions" style="margin-left: 5px;margin-top: 5px;">
                       
                        <!-- <img src="/images/loader/loader.gif" class="postFileLoad pull-left display" style="margin-left: 5px;margin-top:6px;"/> -->
              <div class="spinner display  postFileLoad">
                       <div class="bar1"></div>
                       <div class="bar2"></div>
                       <div class="bar3"></div>
                       <div class="bar4"></div>
                       <div class="bar5"></div>
                       <div class="bar6"></div>
                      <div class="bar7"></div>
                      <div class="bar8"></div>
                      <div class="bar9"></div>
                      <div class="bar10"></div>
             </div>
                     </div>
                  </form>

            <div style="padding: 5px;">
               <div style="text-align: center;">
                  <textarea placeholder="Reply..." class="input-replyMsg replyMsg_conversation" data-id="" style="margin-top:8px; width:100%;" data-get-file="imagePost" data-location="messageUpload" data-file="imagePreviewUpload"></textarea>
               </div>
               
               <div class="imagePreviewUpload display" style="float: left;width: 100%;border: 1px solid #D5D5D5;background-color: #fff;margin-bottom: 5px;"> 
                  <div style="padding: 5px;" class="previewImagePostUpload">

                  </div>
               </div>
               <!--<input type="submit" class="btn-blueBtn replyMsg_conversation" data-id="" data-get-file="imagePost" data-location="messageUpload" data-file="imagePreviewUpload"  value="Reply">-->
            </div>
        </div>
      </div><!-- end of no conversation -->
        <div id="fl-send-msg-form" class="crt_new_msg display" style="min-height: 500px;">
            <div>
               <h2>New Message</h2><br/>
                    <div id="userList" style="float: left;border: 1px solid #ddd;min-height: 40px;margin-top: 5px;width: 100%;padding-bottom: 8px;">
                          <div style="float:left;margin-top: 13px;margin-left:12px;font-weight: bold;">
                             To:
                          </div>
                             <input type="text" id="listRecipient1" class="input-small msgBoxTo" data-tag-id="0" style="border: none;box-shadow:none;margin-left: 12px;margin-top: 8px; width: 92%; background-color:#fafafa;">
                       </div>
                    <Br/>
                    <div style="float:left;width: 100.2%;">
                       <div id="displayUser1"></div>
                    </div>
                    <div id="msgTitle" style="float: left;border: 1px solid #ddd;min-height: 40px;margin-top: 5px;width: 100%;">
                       <div style="float:left;margin-top: 13px;margin-left:12px;font-weight: bold;">
                          Title:
                       </div>
                          <input type="text" id="title" class="input-small" style="border: none;box-shadow:none;margin-left: 2px;margin-top: 4px;width: 92%; background-color:#fafafa;">
                    </div>
                    
                    <textarea id="msgBox" style="float: left;border: 1px solid #ddd; min-height: 260px;margin: 5px 0px;width: 99.2%;"></textarea>
                    <br>
                    
                          <div class="postActions" style="margin-left: 5px;margin-top: 5px;">
                            
                            <!--  <img src="/images/loader/loader.gif" class="postFileLoad pull-left display" style="margin-left: 5px;margin-top:6px;"/> -->
                          </div>

                       
                    <div class="imagePreviewUpload_1 display" style="float: left;width: 100%;border: 1px solid #D5D5D5;margin-top:10px;background-color: #fff;margin-bottom: 5px;"> 
                       <div style="padding: 5px;" class="previewImagePostUpload_1">
        
                       </div>
                    </div>
                    <form id="postFile_1" method="post" enctype="multipart/form-data" action='/ajax/uploadFile'>
                      <br/><br/><br/>
                     <div id="uniform-fileInput" class="uploader">
                                <input type="file" data-action-id="2" value="upload"
                                   name="postFile" id="uploadForm_1" size="24" data-get-file="imagePost_1" data-show="imagePreviewUpload_1" data-form="postFile_1" data-location="previewImagePostUpload_1" data-action-type="postFile" style="opacity: 0;" class="postFile">
                                <span id="uploadFilename_2" class="filename">No file selected</span>
                                <span class="action">Choose File</span>
                                <input type="hidden" value="messageFileUpload" name="uploadType">
                                <input type="hidden" value="messageUpload" name="uploadFolder">
                             </div>
</form>
                    <div class="spinner display  postFileLoad">
                             <div class="bar1"></div>
                             <div class="bar2"></div>
                             <div class="bar3"></div>
                             <div class="bar4"></div>
                             <div class="bar5"></div>
                             <div class="bar6"></div>
                            <div class="bar7"></div>
                            <div class="bar8"></div>
                            <div class="bar9"></div>
                            <div class="bar10"></div>
                   </div>
                    <br />
                    <div style="font-size: 11px;font-style: italic;">
                    <?php
                    
                    $img_extension = unserialize(FILES_EXTENSION);
                    function array_unique_case($array) {
                        sort($array);
                        $tmp = array();
                        $callback = function ($a) use (&$tmp) {
                            if (in_array(strtolower($a), $tmp))
                                return false;
                            $tmp[] = strtolower($a);
                            return true;
                        };
                        return array_filter($array, $callback);
                    }
                    $array_img = array_unique_case($img_extension);
                    
                    $show_img = "";
                     foreach($array_img as $img){
                         $show_img .= $img . ",";
                     }
                    echo substr($show_img, 0, -1);
                    
                    ?>
                    </div>
                    <input type="button" class="btn-blueBtn pull-right newMsg" dataTitle="title" dataMessage="msgBox"  dataTagID="listRecipient1" value="SEND"  data-get-file="imagePost_1" data-location="messageUpload" data-file="imagePreviewUpload_1" style="float:left; margin-top:8px;">
                  <div class="clearfix"></div>
            </div>
        </div>
    </div><!-- end of fl-right -->
      <div class="clearfix"></div>
</div>